import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react-swc'
import UnoCSS from 'unocss/vite'
import postCssPxToRem from 'postcss-pxtorem'
import { fileURLToPath, URL } from 'node:url'
// 路径查找
const pathResolve = (dir: string) => {
  return fileURLToPath(new URL(dir, import.meta.url))
}

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react(), UnoCSS()],
  resolve: {
    alias: {
      '@': pathResolve('src')
    }
  },
  css: {
    // 配置 css-module
    modules: {
      // 开启 camelCase 格式变量名转换
      localsConvention: 'camelCase',
      // 类名 前缀
      generateScopedName: '[local]-[hash:base64:5]'
    },
    postcss: {
      plugins: [
        postCssPxToRem({
          rootValue: 16,
          propList: ['font-size', 'width', 'height', 'gap', 'padding*', 'margin*', 'line-height']
        })
      ]
    }
  },
  build: {
    outDir: '../dist',
    emptyOutDir: true
  }
})
